import { ref, computed } from 'vue';
import { addUnit, sys } from '@/utils/index'

export function usePageHeight({ navbarHeight = 44, tabbarHeight = 0 }){

    const navbarH = ref(navbarHeight)
    // #ifdef H5
    navbarH.value = 0
    // #endif

    const tabbarH = ref(tabbarHeight)

    // topHeight =  sys statusBarHeight ( h5: 0 ) + navbar高度 (wx: 44, h5: 0)
    const topHeight = sys().statusBarHeight + navbarH.value

    const getPageHeight = computed(() => {
        const style = {
            // 页面去掉顶部底部之后的高度
            height: `calc(100% - ${addUnit(topHeight, 'px')} - ${addUnit(tabbarH.value, 'px')})`
        };
        return style;
    })

    const getContentHeight = computed(() => {
        const style = {
            // 减去顶部高度及logo高度64，保持登录框居中
            height: `calc(100% - ${addUnit(topHeight, 'px')} - 64px)`
        };
        return style;
    })
    
    return {
        getPageHeight,
        getContentHeight
    }
}